<!doctype html>
<meta charset="utf-8">
<title>警情警力分析</title>
<link href="${request.contextPath}/statics/css/style.css" rel="stylesheet" type="text/css" media="all" />
<body>
<div class="wpbox" id="rrapp" >
<div class="bnt">
    <div class="topbnt_left fl">
        <ul>
            <li ><a href="/analysis.html">仓储管理</a></li>
            <li ><a href="/people.html">客流统计</a></li>
        </ul>
    </div>
    <h1 class="tith1 fl">气象台</h1>
    <div class=" fr topbnt_right">
        <ul>
            <li><a href="index.html">管理</a></li>
            <li class="active"><a href="/observatory.html">气象台</a></li>
            <!--<li><a href="#">分析报告</a></li>
            <li><a href="#">交通</a></li>
            <li><a href="#">舆情</a></li>-->
        </ul>
        </ul>
    </div>
</div>
<!-- bnt end -->
<div class="puleft fl">
    <div class="pulefttop"><h2 class="tith2"><span>舆情来源分析</span></h2>
    <div class="lefttoday_tit"><p class="fl">地区：甘孜</p><p class="fr">2018-06-14</p></div>
    <div class="box pbox">
      <div class="lefttoday_bar pulefttoday_bar fl">
        <ul>
          <li class="c1 big1" style="top: 25%;left: 16%;"><span>交通警情6</span></li>
          <li class="c2 big2" style="top: 35%;left: 65%;"><span>求助1</span></li>
          <li class="c3 big4" style="top: 25%;left: 35%;"><span>无效报警2</span></li>
          <li class="c4 big5" style="top: 65%;left: 65%;"><span>投诉2</span></li>
          <li class="c5 big6" style="top: 65%;left: 25%;"><span>灾害事故1</span></li>
          <li class="c6 big1" style="top: 45%;left: 15%;"><span>刑事案件1</span></li>
          <li class="c1 big0" style="top: 35%;left: 75%;"></li>
          <li class="c2 big0" style="top: 85%;left: 55%;"></li>
          <li class="c3 big0" style="top: 85%;left: 15%;"></li>
        </ul>
      </div>
      <div class="pvr fr pulefttoday_bar2" >
        <ul>
          <li class="hot1">1</li>
          <li class="hot2">2</li>
          <li class="hot3">3</li>
          <li class="hot4">4</li>
          <li class="hot5">5</li>
        </ul>
            <div id="puleftbox2bott_cont" class="puleftbox2bott_cont" ></div>
      </div>
    </div>
    <!-- lefttoday_number end -->
    </div>
    <div class="puleftboxtmidd">
      <h2 class="tith2">舆情区域分析</h2>
          <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10 至 2018-06-14</p></div>
    <div class="box pbox">
      <div id="puleftboxtmidd1" class="fl puleftboxtmidd1"></div>
          <div class="pvr fr pulefttoday_bar2" >
            <ul>
              <li class="hot1">1</li>
              <li class="hot2">2</li>
              <li class="hot3">3</li>
              <li class="hot4">4</li>
              <li class="hot5">5</li>
            </ul>
            <div id="puleftboxtmidd2" class="puleftbox2bott_cont"></div>
      </div>
    </div>
  </div>
  <div class="puleftboxtbott">
    <h2 class="tith2 pt1">舆情环比分析</h2>
        <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10 至 2018-06-14</p></div>
    <div class="box pbox">
      <div id="puleftboxtbott1" class="fl puleftboxtbott1" ></div>
      <div  class="puleftboxtbott2 fr" >
        <div class="widget-inline-box text-center ">
          <p>今日舆情总数</p>
          <h3 class=" ceeb1fd">54</h3>
          <h4 class="text-muted ">环比<img src="img/iconup.png" height="16" />2%</h4>
        </div>
        <div class="widget-inline-box text-center ">
           <p>本周舆情总数</p>
          <h3 class=" c24c9ff">54</h3>
          <h4 class="text-muted ">环比<img src="img/icondown.png" height="16" />3%</h4>
        </div>
        <div class="widget-inline-box text-center ">
           <p>本月舆情总数</p>
          <h3 class=" cffff00">4</h3>
          <h4 class="text-muted ">环比<img src="img/icondown.png" height="16" />3%</h4>
        </div>
      </div>
    </div>
</div>
</div>
<!--  left1 end -->
<div class="fl pt6 puleft2">
        <div class="pmidd_bott">
          <div class="pumiddboxttop1 fl">
              <h2 class="tith2 pt3">今日舆情</h2>
              <div class="puleft2height observatory-weather-title">
                    <div class="observatory-weather-one" >
                        <div style="padding: 0px 10px;float: left"><img :src="weather.url"/></div>
                        <div style="padding: 0px 10px;float: left">
                            <p class="weather-p">{{weather.temperatureMin}}~{{weather.temperatureMax}}℃</p>
                            <p class="weather-p">{{weather.skyconsName}}</p>
                        </div>
                    </div>
                    <div class="observatory-weather-two">
                        <div class=" observatory-weather-three text-center">
                           <div style="font-size: 20px;padding-top: 9%;text-align: center">
                               {{nowTime}}
                           </div>
                        </div>
                        <div class=" observatory-weather-three text-center"></div>
                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                    <div class="observatory-weather widget-inline-box text-center ">

                    </div>
                  </div>
            </div>

            </div>
            <!--  amidd_bott end-->
            <div class="pmiddboxtbott" >
              <h2 class="tith2 pt1">舆情同比分析</h2>
              <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10 至 2018-06-14</p></div>
              <div class="box pbox">
                <div id="pumiddboxtbott1" class="fl pumiddboxtbott1cont"></div>
                <div  class="pumiddboxtbott2 fr"  >
                  <div class="widget-inline-box text-center ">
                    <p>今年舆情总数</p>
                    <h3 class=" ceeb1fd f30">54</h3>
                    <h4 class="text-muted ">环比<img src="img/iconup.png" height="16" />2%</h4>
                  </div>

                </div>
              </div>
            </div>
            <!-- amidd_bott end -->
        </div>
        <!-- mrbox_top end -->
        <div class="mr_right fl">
          <div class="purightboxtop"><h2 class="tith2 pt12">舆情类别分析</h2>
            <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10</p></div>
            <div id="purightboxtop" class="purightboxtopcont"></div>
          </div>
          <div class="purightboxmidd"><h2 class="tith2 pt12">七日舆情走势分析</h2>
            <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10</p></div>
            <div id="purightboxmidd" class="purightboxmiddcont"></div>
          </div>
            <div class="purightboxbott"><h2 class="tith2 pt12">矛盾纠纷七日数据分析</h2>
              <div class="lefttoday_tit"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10 至 2018-06-14</p></div>
                <div id="purightboxbott" class="purightboxbottcont" ></div>
            </div>
        </div>
        <!-- mrbox_top_right end -->
      </div>


</div>
</div>
<script src="${request.contextPath}/statics/plugins/echarts/echarts.min.js" charset="utf-8"></script>
<script src="${request.contextPath}/statics/libs/jquery.min.js"></script>
<script src="${request.contextPath}/statics/libs/vue.min.js"></script>
<script src="${request.contextPath}/statics/libs/bootstrap.min.js"></script>
<script src="${request.contextPath}/statics/libs/jquery.slimscroll.min.js"></script>
<script src="${request.contextPath}/statics/libs/fastclick.min.js"></script>
<script src="${request.contextPath}/statics/libs/app.js"></script>
<script src="${request.contextPath}/statics/js/observatory.js"></script>


<style>
    .btnbox{position: fixed; bottom: 20px; width: 100%; text-align: center; z-index: 1000;}
    .btnbox a{ margin:0 3px;border-radius: 30px; color: #fff; font-size: 18px; padding:8px 25px; text-shadow: -1px -1px 0px rgba(0,0,0,0.2); transition:all 0.5s;}
    .btnbox .btn1{background: linear-gradient(60deg,#26c6da,#00acc1);box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(0,188,212,.4);}

    .btnbox .btn2{background: linear-gradient(60deg,#66bb6a,#43a047);box-shadow: 0 4px 20px 0 rgba(0,0,0,.14), 0 7px 10px -5px rgba(76,175,80,.4);
    }
    .btnbox a:hover{background: #47c8ff}
    .observatory-weather{
        width: 21% !important;
        height: 0% !important;
    }
    .observatory-weather-one{
        width: 45% ;
        height: 7% ;
        color: rgba(255,255,255,.9);
        width: 50%;
        text-align: left;
        font-size: 12px;
        height: 26%;
        float: left;
        overflow: hidden;
        padding: 3% 0%;
        background: rgba(1,202,217,.2);
    }
    .observatory-weather-two{
        float: left;
        width: 50% !important;
        height: 37%;
    }
    .observatory-weather-three{
        width: 88%;
        background: rgba(1,202,217,.2);
        margin-left: 2%;
        margin-bottom: 1%;
        height: 45%;
    }
    .observatory-weather-title{
        margin-top: 5%;
    }
    .pt3{
        padding-top: 1.3%;
    }
    .weather-p{
        font-size: 25px;
        margin-top: 5%;
    }
</style>
	<!---end-->	

</body>
</html>
